const app = getApp();
var QQMapWX = require('../../utils/qqmap-wx-jssdk.min');
var qqmapsdk;
import tool from "../../utils/tool.js";
Page({
  //  页面的初始数据
  data: {
    click: false, //是否显示弹窗内容
    option: false, //显示弹窗或关闭弹窗的操作动画 
    isShow:true,
    navState: 0,//导航状态
    nowCity:'定位中',
    isPop:false,
    state:0,
    state1:0,
    currenttertiaryindex:'',
    tertiary:'',
    priceSingle:'', 
    currentsecondindex:'',
    price:[
      {money:'不限',isactive:false}, 
      {money:'1000元以下',isactive:false},
      {money:'1000-1500元',isactive:false},
      {money:'1500-2000元',isactive:false},
      {money:'2000-2500元',isactive:false},
      {money:'2500-3000元',isactive:false},
    ],
    matter:[
      {
        id:1,
        name:'朝向',
        orientation:[
          {
            name:'南',
            isactive:false
          },
          {
            name:'北',
            isactive:false
          },
          {
            name:'东',
            isactive:false
          },
          {
            name:'西',
            isactive:false
          }
        ]
      }
    ],
    matters:[  
      {
        name:'房源特色',
        orientation:[
          {
            name:'智能生活',
            isactive:false
          },
          {
            name:'深呼吸',
            isactive:false
          },
          {
            name:'首次出租',
            isactive:false
          },
          {
            name:'loft',
            isactive:false
          },
          {
            name:'有电梯',
            isactive:false
          },
          {
            name:'离地铁近',
            isactive:false
          },
          {
            name:'绿化率高',
            isactive:false
          },
          {
            name:'视频看房',
            isactive:false
          },
          {
            name:'VR看房',
            isactive:false
          }
        ]
      },
      {
        name:'签约时长',
        orientation:[
          {
            name:'年租',
            isactive:false
          },
          {
            name:'可短租',
            isactive:false
          }
        ]
      },
      {
        name:'房源状态',
        orientation:[
          {
            name:'可立即入住',
            isactive:false
          },
          {
            name:'可预约',
            isactive:false
          },
          {
            name:'自如客转租',
            isactive:false
          },
          {
            name:'可预订',
            isactive:false
          }
        ]
      },
    ],
    smallNavindex:0,
    menuTop:'',
    currentindex:'',
    menuFixed:false,
    second:'',
    // 轮播图数据
    swiperList:[
     ' https://webimg.ziroom.com/9a546f13-9ceb-466e-a467-88c9dae70338.jpg',
      'https://webimg.ziroom.com/187cd94a-7aea-435c-b780-2ff8d2df2677.jpg'
    ],
    imgUrl:' https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fn.sinaimg.cn%2Ftranslate%2F760%2Fw495h265%2F20200506%2Fb4e1-iteyfwv7389910.jpg&refer=http%3A%2F%2Fn.sinaimg.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1623340076&t=be951d706eaacb1de7ffc15f808dec61',
    imgUrltoo:'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=637163606,1131459948&fm=26&gp=0.jpg',
    tabNav:[
      {
        "name":"智能生活",
        "color":"#a9a9a9",
        "background":"#f7f7f7",
        isactive:false,
      },
      {
        "name":"精选业主直租",
        "color":"#b3a690",
        "background":"#f9f5f2",
        isactive:false,
      },
      {
        "name":"友家6.0ZHOME",
        "color":"#6FB1BD",
        "background":"#f0f8fa",
        isactive:false,
      },
      {
        "name":"深呼吸",
        "color":"#6FB1BD",
        "background":"#f0f8fa",
        isactive:false,
      },
      {
        "name":"非首次出租",
        "color":"#a9a9a9",
        "background":"#f7f7f7",
        isactive:false,  
      }
    ],
    categories:[
      {
        "name":"位置",   
      },
      {
        "name":"合租/整租",      
      },
      {
        "name":"租金",      
      },
      {
        "name":"筛选",      
      }
    ],
    goodList:[
      {
        "name":"央湖名邸二期 4居室-05卧",
        "url":"//img.ziroom.com/pic/house_images/g2m3/M00/FF/FD/ChAZE2CRauyAaXYKAAVLGqvkPmU086.png_C_240_180_Q100.png",
        "distance":"小区距广都站步行约409米",
        "price":"1060",
        "specification":[
          "8.2m²  ",
          "| 4室1厅 ",
          " | 朝南"
        ],
        "labels": [{
          "name": "有家6.0",
          "label_color": "#fff"
        },
        {
          "name": "独立阳台",
          "label_color": "#717171"
        }
      ],
      },
      {
        "name":"中德英伦世邦K区 4居室-05卧",
        "url":"//img.ziroom.com/pic/house_images/g2m3/M00/04/63/ChAZVGCTuhOAX15sAC6xp58jtls698.jpg_C_240_180_Q100.jpg",
        "distance":"小区距广都站步行约409米",
        "price":"1330",
        "specification":[
          "8.2m²  ",
          "| 4室1厅 ",
          " | 朝南"
        ],
        "labels": [{
          "name": "深呼吸2.0",
          "label_color": "#fff"
        },
        {
          "name": "全部空置",
          "label_color": "#717171"
        }
      ],
      },
      {
        "name":"东苑B区4居室-南卧",
        "url":"//img.ziroom.com/pic/house_images/g2m1/M00/8C/DA/ChAFB1w-r0SAEOSsABTWv7bg-kE327.jpg_C_240_180_Q100.jpg",
        "distance":"小区距广都站步行约409米",
        "price":"1830",
        "specification":[
          "8.2m²  ",
          "| 4室1厅 ",
          " | 朝南"
        ],
        "labels": [{
          "name": "离地铁近",
          "label_color": "#717171"
        },
        {
          "name": "主卧独卫",
          "label_color": "#717171"
        }
      ],
      },
      {
        "name":"新希望锦官阁 5居室 01卧",
        "url":"//img.ziroom.com/pic/house_images/g2m3/M00/42/87/ChAZVGAaOa6AT23CAB5sQ023MSg086.jpg_C_240_180_Q100.jpg",
        "distance":"小区距广都站步行约409米",
        "price":"1660",
        "specification":[
          "8.2m²  ",
          "| 4室1厅 ",
          " | 朝南"
        ],
        "labels": [{
          "name": "深呼吸2.0",
          "label_color": "#fff"
        },
        {
          "name": "智能生活",
          "label_color": "#717171"
        }
      ],
      },
      {
        "name":"中港CCPARK 4居室 01卧",
        "url":"//img.ziroom.com/pic/house_images/g2m1/M00/AD/D8/ChAFB1xH6uaAElF3ABd9bOQfwCU467.jpg_C_240_180_Q100.jpg",
        "distance":"小区距广都站步行约409米",
        "price":"1830",
        "specification":[
          "8.2m²  ",
          "| 4室1厅 ",
          " | 朝南"
        ],
        "labels": [{
          "name": "主卧独卫",
          "label_color": "#717171"
        },
        {
          "name": "智能生活",
          "label_color": "#717171"
        }
      ],
      }
    ],
    city:[
      {
        "name":"北京"
      },
      {
        "name":"上海"
      },
      {
        "name":"深圳"
      },
      {
        "name":"杭州"
      },
      {
        "name":"南京"
      },
      {
        "name":"成都"
      },
      {
        "name":"武汉"
      },
      {
        "name":"广州"
      },
      {
        "name":"天津"
      },
      {
        "name":"苏州"
      }
    ],
    list:[
    {
      lable:'附近',
      isactive:false,
      children:[
        {
          
        }
      ]
    },
    {
      lable:'商圈',
      isactive:false,
      children:[
        {
          lable:'锦江',
          children:[
            {
              lable:'东大路'
            },
            {
              lable:'川大'
            },
            {
              lable:'川师'
            }
          ]
        },
        {
          lable:'青羊',
          children:[
            {
              lable:'草市街'
            },
            {
              lable:'八宝街'
            },
            {
              lable:'贝森'
            }
          ]
        },
        {
          lable:'武侯',
          children:[
            {
              lable:'川音'
            },
            {
              lable:'川大'
            },
            {
              lable:'草金立交'
            }
          ]
        }
      ]
    },
    {
      lable:'地铁',
      isactive:false,
      children:[
        {
            lable:'1号线',
            children:[
              {
                lable:'人名北路'
              },
              {
                lable:'神仙胡'
              },
              {
                lable:'火车北站'
              },
            ]  
        },
        {
          lable:'2号线',
          children:[
            {
              lable:'百草路'
            },
            {
              lable:'天府广场'
            },
            {
              lable:'犀浦'
            },
          ]  
      },
      {
        lable:'3号线',
        children:[
          {
            lable:'团结新区'
          },
          {
            lable:'成都医学院'
          },
          {
            lable:'石油大学'
          },
        ]  
    },

      ]
    }
    ],
    smallNav:[
      {
        name:'不限',
        children:[
          {
            name:'朝向',
            orientation:[
              {
                name:'南',
                isactive:false
              },
              {
                name:'北',
                isactive:false
              },
              {
                name:'东',
                isactive:false
              },
              {
                name:'西',
                isactive:false
              }
            ]
          }
        ]
      },
      {
        name:'合租',
        children:[
          {
            name:'精选房型',
            orientation:[
              {
                name:'主卧独卫',
                isactive:false
              },
              {
                name:'独立阳台',
                isactive:false
              }
            ]
          },
          {
            name:'朝向',
            orientation:[
              {
                name:'南',
                isactive:false
              },
              {
                name:'北',
                isactive:false
              },
              {
                name:'东',
                isactive:false
              },
              {
                name:'西',
                isactive:false
              }
            ]
          },
          {
            name:'装修风格',
            orientation:[
              {
                name:'友家6.0ZHOME',
                isactive:false
              },
              {
                name:'友家6.0',
                isactive:false
              },
              {
                name:'友家5.0',
                isactive:false
              },
              {
                name:'友家4.0',
                isactive:false
              },
              {
                name:'友家3.0',
                isactive:false
              },
              {
                name:'友家2.0',
                isactive:false
              }
            ]
          }
        ]
      },
      {
        name:'整租',
        children:[
          {
            name:'朝向',
            orientation:[
              {
                name:'南',
                isactive:false
              },
              {
                name:'北',
                isactive:false
              },
              {
                name:'东',
                isactive:false
              },
              {
                name:'西',
                isactive:false
              }
            ]
          },
          {
            name:'装修风格',
            orientation:[
              {
                name:'自如心舍',
                isactive:false
              },
              {
                name:'整租4.0',
                isactive:false
              },
              {
                name:'整租3.0',
                isactive:false
              },
              {
                name:'精选业主直租',
                isactive:false
              },
              {
                name:'整租2.0',
                isactive:false
              },
              {
                name:'整租1.0',
                isactive:false
              },
              {
                name:'业主原装',
                isactive:false
              }
            ]
          }
        ]
      }
    ]
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    qqmapsdk = new QQMapWX({
      key: 'XVABZ-BKQCG-ESMQK-ISCIM-B7BEZ-3GFSG' //这里自己的key秘钥进行填充
    });
    let vm = this;
    vm.getUserLocation();
    var query = wx.createSelectorQuery()//创建节点查询器 query
        query.select('#fix').boundingClientRect()//选择Id的节点，获取节点位置信息的查询请求
        query.select('#aaBox').boundingClientRect()//选择Id的节点，获取节点位置信息的查询请求
        query.exec(function (res) {
          // console.log(res[0].top); // #fix节点的上边界坐标
          // console.log(res[1].top); // #fix节点的上边界坐标
          vm.setData({
            menuTop: res[0].top, 
            aaBoxTop:res[1].top
          })
        }); 
  },
  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {     
  },
  // 滚动吸顶
  onPageScroll: function (e) {
    // console.log(e.scrollTop);//{scrollTop:99}
    var that = this;
    let menuTop = that.data.menuTop - that.data.aaBoxTop;
    var isSatisfy = e.scrollTop >= menuTop ? true : false;
    if (that.data.menuFixed === isSatisfy) {
      return false;
    }
    that.setData({   
      menuFixed: isSatisfy
    });
    //当页面滚动距离scrollTop > menuTop某元素距离文档顶部的距离时，某元素固定定位
    // if (e.scrollTop > that.data.menuTop - that.data.aaBoxTop) {   
    //   that.setData({
    //     menuFixed: true
    //   })
    // } else {
    //   that.setData({
    //     menuFixed: false
    //   })
    // }
  },
  getUserLocation: function () {
    let vm = this;
    wx.getSetting({
      success: (res) => {
        // console.log(JSON.stringify(res))
        // res.authSetting['scope.userLocation'] == undefined    表示 初始化进入该页面
        // res.authSetting['scope.userLocation'] == false    表示 非初始化进入该页面,且未授权
        // res.authSetting['scope.userLocation'] == true    表示 地理位置授权
        if (res.authSetting['scope.userLocation'] != undefined && res.authSetting['scope.userLocation'] != true) {
          wx.showModal({
            title: '请求授权当前位置',
            content: '需要获取您的地理位置，请确认授权',
            success: function (res) {
              if (res.cancel) {
                wx.showToast({
                  title: '拒绝授权',
                  icon: 'none',
                  duration: 1000
                })
              } else if (res.confirm) {
                wx.openSetting({
                  success: function (dataAu) {
                    if (dataAu.authSetting["scope.userLocation"] == true) {
                      wx.showToast({
                        title: '授权成功',
                        icon: 'success',
                        duration: 1000
                      })
                      //再次授权，调用wx.getLocation的API
                      vm.getLocation();
                    } else {
                      wx.showToast({
                        title: '授权失败',
                        icon: 'none',
                        duration: 1000
                      })
                    }
                  }
                })
              }
            }
          })
        } else if (res.authSetting['scope.userLocation'] == undefined) {
          //调用wx.getLocation的API
          vm.getLocation();
        }
        else {
          //调用wx.getLocation的API
          vm.getLocation();
        }
      }
    })
  },
  // 微信获得经纬度
  getLocation: function () {
    let vm = this;
    wx.getLocation({
      type: 'wgs84',
      success: function (res) { 
        // console.log(JSON.stringify(res))
        var latitude = res.latitude   //29.64888
        var longitude = res.longitude   //106.371877
        vm.getLocal(latitude, longitude)
      },
      fail: function (res) {
        // console.log('fail' + JSON.stringify(res))
      }
    })
  },
   // 获取当前地理位置
   getLocal: function (latitude, longitude) {
    let vm = this;
    qqmapsdk.reverseGeocoder({
      location: {
        latitude: latitude,
        longitude: longitude
      },
      success: function (res) {
        // console.log(JSON.stringify(res));
        // console.log(res.result.ad_info.city);
        let city = res.result.ad_info.city.match(/(.*)市/)[1]
        vm.setData({
          nowCity: city,
        })
      },
      fail: function (res) {
        // console.log(res);
      },
      complete: function (res) {
        // console.log(res);
      }
    });
  },
  //点击按钮改变颜色
  btnClick(e){
    var index = parseInt(e.currentTarget.dataset.index);
   this.setData({
     [`tabNav[${index}].isactive`]:!this.data.tabNav[index].isactive
   })
  },
  //打开定位窗口
  openLocation(){
    // const query = wx.createSelectorQuery();
	  // query.select('.citylistBox').boundingClientRect();
	  // query.exec((res) => {
	  // console.log(res); //这个节点距离顶部的距离   和距离底部的距离
	  // this.menutop = res[0].top;
    // })
    let _that = this;
    if (!_that.data.click) {
      console.log(!_that.data.click);
      _that.setData({
        click: true,
        isShow:false,
        isPop:false
      })
    }
    if (_that.data.option) {
      console.log(_that.data.option);
      _that.setData({
        option: false,
      })

      // 关闭显示弹窗动画的内容，不设置的话会出现：点击任何地方都会出现弹窗，就不是指定位置点击出现弹窗了
      setTimeout(() => {
        _that.setData({
          click: false,
        })
      }, 300)
    } else {  
      _that.setData({
        option: true
      })
    }
  },
  //关闭定位窗口
  closeWindow(){
    let _that = this;
    if (!_that.data.click) {
      _that.setData({
        click: true,
      })
    }
    if (_that.data.option) {
      _that.setData({
        option: false,
      })

      // 关闭显示弹窗动画的内容，不设置的话会出现：点击任何地方都会出现弹窗，就不是指定位置点击出现弹窗了
        _that.setData({
          click: false,
          isShow:true
        })
    } else {  
      _that.setData({
        option: true
      })
    }   
  },
  //重新定位
  againLocation(){
    this.setData({
      nowCity:'定位中...'
    })
    this.getUserLocation();
  },
  //切换城市
  cutCity(e){
    var index = parseInt(e.currentTarget.dataset.index);
    let city = this.data.city;
    // console.log(city[index].name);
    this.setData({
      nowCity:city[index].name,
      click: false,
      option:false,
      isShow:true 
    })
  },
  //点击滚动到顶部
  toggle(e){
    let index = parseInt(e.currentTarget.dataset.index);
    // console.log(index + '444');
    wx.pageScrollTo({
      scrollTop: e.currentTarget.offsetTop - (this.data.aaBoxTop),
      duration: 0 
    })
    this.setData({
      isPop:true, 
      navState:index
    })
  },
  //点击展开联动列表
  toggleBtn(e){ 
    let index = parseInt(e.currentTarget.dataset.index);
    this.setData({
      isPop:true, 
      navState:index
    })
    console.log(index);  
  },
  //阻止冒泡
  preventD(){
    return;
  },
  //点击关闭弹窗
  closePop(){
    this.setData({
      isPop:false  
    })
  },  
  //三级联动
  lableBtn(e){
    let index = parseInt(e.currentTarget.dataset.index);
    // console.log(this.data.list[index].children,);
    // console.log(this.data.second.length);
    this.setData({ 
      // [`list[${index}].isactive`]:!this.data.list[index].isactive,
      currentindex:index, 
      second:this.data.list[index].children,
      tertiary:'',
      currentsecondindex:''
    });
    if(index==0){
      this.setData({
        [`categories[${0}].name`]:'附近',
        isPop:false
      })
    }
  },
  //二级
  lablesecondBtn(e){
    let index = parseInt(e.currentTarget.dataset.index);
    this.setData({
      currentsecondindex:index, 
      tertiary:this.data.second[index].children,
      currenttertiaryindex:''
    })
  },
  //弹窗2导航栏
  smallNavbtn(e){
    let index = parseInt(e.currentTarget.dataset.index);
    console.log(index);
    this.setData({ 
      smallNavindex:index,
      matter:this.data.smallNav[index].children
    })
  },
  //弹窗2导航栏内容点击
  mattertxtlistBtn(e){
    // console.log(e);
    let index = parseInt(e.currentTarget.dataset.index1);
    let index1 = parseInt(e.currentTarget.dataset.index2);
      this.setData({
        [`matter[${index}].orientation[${index1}].isactive`]:!this.data.matter[index].orientation[index1].isactive,
      }) 
  },
  //点击改变状态值
  mattertxtlistBtnt(e){
    // console.log(e);
    let index = parseInt(e.currentTarget.dataset.index);
    let index1 = parseInt(e.currentTarget.dataset.index1);
    this.setData({
      [`matters[${index}].orientation[${index1}].isactive`]:!this.data.matters[index].orientation[index1].isactive,
    }) 
  },
  // 点击价钱改变颜色
  clickchangeColor(e){
    let index = parseInt(e.currentTarget.dataset.index);
    this.setData({
     priceSingle:index,
     [`categories[${2}].name`]:this.data.price[index].money,
     isPop:false 
    })
  },
  labletertiaryBtn(e){
    let index = parseInt(e.currentTarget.dataset.index);
    this.setData({
      currenttertiaryindex:index,
      [`categories[${0}].name`]:this.data.tertiary[index].lable,
      isPop:false 
     })
     
  },
  sureBtn(){
    this.setData({
      isPop:false,
      state:1
    })
  },
  sureBtnone(){
    this.setData({
      isPop:false,
      state1:1
    })
  }
})
